<template>
  <div class="modal is-active p-2">
    <div class="modal-background"></div>
    <div
      class="modal-card"
    >
      <header class="modal-card-head">
        <p class="modal-card-title">删除事项？</p>
        <button
          class="delete"
          aria-label="close"
          @click="emit('message', false)"
        ></button>
      </header>
      <section class="modal-card-body">
        是否真的要删除？ 
      </section>
      <footer class="modal-card-foot is-justify-content-flex-end">
        <button
          class="button"
          @click="emit('message', false)"
        >
          取消
        </button>
        <button
          class="button is-danger"
          @click="emit('message', true)"
        >
          确定
        </button>
      </footer>
    </div>
  </div>
</template>

<script setup>
const emit = defineEmits(['message'])
</script>